 */
@charset "UTF-8";
/*------------------------------------*\
INUIT.CSS
\*------------------------------------*/
/*
Author:             Harry Roberts
Twitter:            @inuitcss
Author URL:         csswizardry.com
Project URL:        inuitcss.com
Version:            3.2
Date:               24 November 2011
Copyright 2011 Harry Roberts
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/*------------------------------------*\
CONTENTS
\*------------------------------------*/
/*
RESET
SHARED
MAIN
GRIDS
CLEARFIX
ISLAND
MEDIA
LOGO
NAV
TYPE
IMAGES
FORMS
TABLES
MESSAGES
MISC
CLASSES
DIAGNOSTICS
NARROW
MOBILE
PRINT
*/
/*------------------------------------*\
$RESET
\*------------------------------------*/
/*
A more considered reset; more of a restart... csswizardry.com/2011/10/reset-restarted
*/
html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,hr,
a,abbr,address,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strong,sub,sup,tt,var,
b,u,i,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
margin:0;
padding:0;
}
article,aside,details,figcaption,figure,footer,
header,hgroup,menu,nav,section{
display:block;
}

table{
border-collapse:collapse;
border-spacing:0;
}
strong,b,mark{
font-weight:bold;
font-style:inherit;
}
em,i,cite,q,address,dfn,var{
font-style:italic;
font-weight:inherit;
}
abbr[title],dfn[title]{
cursor:help;
border-bottom:1px dotted;
}
ins{
border-bottom:1px solid;
}
a,u,ins{
text-decoration:none;
}
del,s{
text-decoration:line-through;
}

small{
font-size:0.75em;
}
img{
border:none;
font-style:italic;
}
input,
select,option,optgroup,
textarea{
font:inherit;
}
/*------------------------------------*\
$SHARED
\*------------------------------------*/
/*
Rather than repeating declarations over and over, lets make a shared section.
*/

ul,ol,dl,p,address,figure,pre,fieldset,table,hr,
.nav,.island,.media{
margin-bottom:20px;
margin-bottom:1.5rem;
}
figcaption,small{
font-size:12px;
font-size:0.75rem;
}
ul,ol,dd{
margin-left:3em;
}
small,code{
line-height:1;
}
pre,code,
input,textarea{
font:inherit;
}
/*------------------------------------*\
$MAIN
\*------------------------------------*/
html{
overflow-y:scroll; /* Force scrollbars 100% of the time */
font-size:100%; /* Use 16px as per informationarchitects.jp/en/100e2r/ and wilsonminer.com/posts/2008/oct/20/relative-readability/ */
line-height:1.5; /* A safe default for type of any size. */
/* You should always specify a colour and background, override these in your own stylesheet if desired. */
background-color:#fff;
color:#333;
}
body{
min-height:100%;
}
/*------------------------------------*\
$CLEARFIX
\*------------------------------------*/
/*
Fix clearing issues as per: nicolasgallagher.com/micro-clearfix-hack/
*/
.cf,
.grids,
.media{
zoom:1;
}
.cf:before,
.grids:before,
.media:before,
.cf:after,
.grids:after,
.media:after{
content:"";
display:table;
}
.cf:after,
.grids:after,
.media:after{
clear:both;
}
/*------------------------------------*\
$TABLES
\*------------------------------------*/
/*
Unfortunately, and somewhat obviously, tables dont fit the baseline all too well. Perhaps in a later version...
*/
table{
width:100%;
max-width:100%;
table-layout: fixed;
}
thead tr:last-of-type th{
/* Thicker border on the table-headers of the last row in the table head. */
border-bottom-width:2px;
}
tbody th{
/* Thicker right border on table-headers in the table body. */
border-right-width:2px;
}
th:empty{
/* Hide the borders on any empty table-headers. */
border:none;
}
th,td{
vertical-align:top;
padding:0.75em;
border:1px solid #ccc;
}
th{
font-weight:bold;
text-align:center
}
table [colspan]{
text-align:center;
}
table [rowspan]{
vertical-align:middle;
}
/*
Assuming IE has an 'implied' colspan of one on cells without an explicit colspan attribute, fix/undo it.
See jsfiddle.net/csswizardry/UJJay/
*/
[colspan="1"]{
text-align:left;
}
[rowspan="1"]{
vertical-align:top;
}
tbody tr:nth-of-type(odd){
background:rgba(0,0,0,0.05);
}
tfoot{
text-align:center;
}
tfoot td{
border-top-width:2px;
}
/*------------------------------------*\
$MESSAGES
\*------------------------------------*/
/*
Unfortunately feedback messages dont fit the baseline all too well. Perhaps in a later version...
*/
.message{
font-weight:normal;
display:block;
padding:10px 10px 10px 36px;
border:1px solid #ccc;
margin-left:0;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
-moz-box-shadow:0 1px 0 rgba(255,255,255,0.5) inset;
-webkit-box-shadow:0 1px 0 rgba(255,255,255,0.5) inset;
box-shadow:0 1px 0 rgba(255,255,255,0.5) inset;
}
/*
With multiple errors its nice to group them:
<ul class=message>
<li>Please provide a surname.</li>
<li>Please enter a valid email address.</li>
</ul>
*/
ul.message{
list-style:decimal outside; /* Its also handy to number them. However, they might not necessarily be in a particular order, so we spoof it by putting numbers on an unordered list */
padding:10px 10px 10px 56px;
}
.error{
border-color:#fb5766;
background:url(../img/css/icons/error.png) 10px center no-repeat #fab;
}
.success{
border-color:#83ba77;
background:url(../img/css/icons/success.png) 10px center no-repeat #d1feba;
}
.info{
border-color:#85a5be;
background:url(../img/css/icons/info.png) 10px center no-repeat #c4dbec;
}
.warning{
border-color:#d8d566;
background:url(../img/css/icons/warning.png) 10px center no-repeat #fef8c4;
}
*------------------------------------*\
$IMAGES
\*------------------------------------*/
img{
max-width:100%;
height:auto;
/* Give it some text styles to offset alt text */
color:#c00;
}
img { -ms-interpolation-mode: bicubic; }
img.left	{ margin:0 1.5em 0 0; }
img.right	{ margin:0 0 0 1.5em; }
/*--- FLASH/VIDEO ---*/
object,
embed,
video{
max-width:100%;
height:auto;
}
/*------------------------------------*\
$FORMS
\*------------------------------------*/
/*
Unfortunately, and somewhat obviously, forms dont fit the baseline all too well. Perhaps in a later version...
*/
/*fieldset{
padding:1.5em;
border:1px solid #ccc;
}
label{
display:block;
}
.text-input{
}
label,
.text-input,
textarea,
.btn{
cursor:pointer;
}
.text-input:active,
.text-input:focus,
textarea:active,
textarea:focus{
cursor:text;
}
.check-list{
width:100%;
overflow:hidden;
list-style:none;
margin-left:0;
}
.check-list li{
width:25%;
float:left;
}
.check-label{
display:inline;
}
fieldset > :last-child{
margin-bottom:0;
}*/
